$(document).ready(function() {
    
    $('.comment-options .reply').click(function() {
        
        $('.reply-comment-form').remove();
        
        var last = '';
        var isReplys = $(this).parent().parent().find('.reply');
        if(isReplys.length === 1) {
            last = 'last';
        }
        
        var comment_id = $(this).parent().parent().attr('id');
        var post_id = $('.comment-form input[name="post_id"]').attr('value');
        var comment_form = '<div class="reply reply-comment-form '+last+'">'
                                +'<form action="post.php" method="POST">'
                                    +'<input type="text" name="name" placeholder="Name *" required>'
                                    +'<input type="text" name="email" placeholder="E-mail *" required>'
                                    +'<input class="last" type="text" name="website" placeholder="Website">'
                                    +'<textarea name="comment" placeholder="Comment *" required></textarea>'
                                    +'<input type="hidden" name="leave_comment" value="1">'
                                    +'<input type="hidden" name="post_id" value="'+post_id+'">'
                                    +'<input type="hidden" name="reply_to" value="'+comment_id+'">'
                                    +'<span class="button" onclick="submitComment(this);">Submit</span>'
                                +'</form>'
                            +'</div>';
        
        $(this).parent().after(comment_form);
    });
});

function submitComment(element) {
    
    var form = $(element).parent();
    var post_id = $(form).children('input[name="post_id"]').val();
    
    $.ajax({
        url: 'post.php?id='+post_id,
        type: 'POST',
        data: {
            name: $(form).children('input[name="name"]').val(),
            email: $(form).children('input[name="email"]').val(),
            website: $(form).children('input[name="website"]').val(),
            comment: $(form).children('textarea').val(),
            post_id: post_id,
            reply_to: $(form).children('input[name="reply_to"]').val(),
            leave_comment: $(form).children('input[name="leave_comment"]').val()
        },
        dataType: 'JSON'
    }).done(function(comment) {
        
        var author = comment['author_name'];
        if(comment['author_website']) {
            author = '<a href="'+ comment['author_website'] +'" target="_blank">'+ comment['author_name'] +'</a>';
        }

        var comment_html = '<div class="reply">'
                            +'<div class="comment-title">'
                                +'<span class="author">' + author + '</span> said:'
                                +'<span class="time">'+ comment['time'] +'</span>'
                            +'</div>'
                            +'<div class="comment-content">'
                                +'<p>'+ comment['content'] +'</p>'
                            +'</div>'
                            +'<div class="comment-options">'
                                +'<a href="" class="report">Report</a>'
                            +'</div>'
                        +'</div>';
        
        console.log(comment_html);
        console.log($(form).parent().parent().children('.comment-options'));
        
        $(form).parent().parent().children('.comment-options').after(comment_html);
        $(form).parent().remove();
    });
};